<!-- user表单弹窗 -->
<form id="shop-form" lay-filter="shop-form"
	class="layui-form model-form">
	<input name="id" type="hidden" /> <input name="shopLevel" type="hidden" />
	<div class="layui-form-item">
		<div class="layui-inline">
			<label class="layui-form-label">店名</label>
			<div class="layui-input-block">
				<input name="shopName" placeholder="请输入门店名称" type="text"
					class="layui-input" maxlength="50" lay-verify="required" required />
			</div>
		</div>

		<div class="layui-inline">
			<label class="layui-form-label">国家</label>
			<div class="layui-input-block">
				<input type="radio" name="area" value="0" title="国内" checked lay-filter="area"/> 
				<input type="radio" name="area" value="1" title="国外" lay-filter="area"/>
			</div>
		</div>
		<!--<div class="layui-inline">-->
		<!--<label class="layui-form-label">电话</label>-->
		<!--<div class="layui-input-block">-->
		<!--<input name="shopTel" placeholder="请输入电话" type="text"-->
		<!--class="layui-input" lay-verify="required|number" required/>-->
		<!--</div>-->
		<!--</div>-->
	</div>
	<div class="layui-form-item layui-anim">
		<div class="layui-inline">
			<label class="layui-form-label">省份</label>
			<div class="layui-input-block">
				<select lay-filter="provinceCode" name="provinceCode"
					 lay-search>
					<option value="">请选择省</option> <% for(provice in provices) { %>
					<option value="${provice.cityCode}" title="${provice.id}">${provice.cityName}</option>
					<% } %>
				</select>
			</div>
		</div>
		<div class="layui-inline">
			<label class="layui-form-label">城市</label>
			<div class="layui-input-block">
				<% if(citys != null){ %> <select lay-filter="cityCode"
					name="cityCode" lay-search> <% for(city in citys) { %>
					<option value="${city.cityCode}" title="${city.id}">${city.cityName}</option>
					<% } %>
				</select> <% }else{ %> <select lay-filter="cityCode" disabled="disabled"
					name="cityCode" lay-search></select> <% } %>
			</div>
		</div>
	</div>
	<div class="layui-form-item layui-anim">
		<div class="layui-inline">
			<label class="layui-form-label">区域</label>
			<div class="layui-input-block">
				<% if(areas != null){ %> <select name="areaCode" lay-search>
					<% for(area in areas) { %>
					<option value="${area.cityCode}" title="${area.id}">${area.cityName}</option>
					<% } %>
				</select> <% } else {%> <select disabled="disabled" name="areaCode"
					lay-search></select> <% } %>
			</div>
		</div>
	</div>
	<div class="layui-form-item">
		<label class="layui-form-label">地址</label>
		<div class="layui-input-block">
			<input name="address" placeholder="请输入地址" type="text"
				 class="layui-input" lay-verify="required"
				required />
		</div>
	</div>

	<div class="layui-form-item">
		<div class="layui-inline">
			<label class="layui-form-label">店长</label>
			<div class="layui-input-block">
				<select lay-filter="managerId" name="managerId"
					lay-verify="required" lay-search>
					<option value="">请选择店长</option> <% for(manager in managers) { %>
					<option value="${manager.userId}">${manager.nickName}--Tel:${manager.phone}</option>
					<% } %>

				</select>
			</div>
		</div>
		<div class="layui-inline">
			<label class="layui-form-label">招商</label>
			<div class="layui-input-block">
				<select lay-filter="merchantsId" name="merchantsId"
					lay-verify="required" lay-search>
					<option value="">请选择招商</option> <% for(merchant in merchants) { %>
					<option value="${merchant.userId}">${merchant.nickName}--Tel:${merchant.phone}</option>
					<% } %>

				</select>
			</div>
		</div>
	</div>

	<div class="layui-form-item">
		<label class="layui-form-label">状态</label>
		<div class="layui-input-block">
			<input type="radio" name="shopStatus" value="1" title="正常" checked />
			<input type="radio" name="shopStatus" value="0" title="停店" />
		</div>
	</div>


	<div class="layui-form-item model-form-footer">
		<button class="layui-btn layui-btn-primary" type="button"
			ew-event="closeDialog">取消</button>
		<button class="layui-btn" lay-filter="form-submit" lay-submit>保存</button>
	</div>
</form>
<script>
    layui.use(['layer', 'admin', 'form', 'formSelects', 'upload'],
        function () {
            var $ = layui.jquery;
            var layer = layui.layer;
            var admin = layui.admin;
            var form = layui.form;
            var upload = layui.upload;
            var formSelects = layui.formSelects;

            form.render('radio');
            form.render('select');
            
            form.on('radio(area)', function(data){
            	  if(data.value == 1){
            		  $(".layui-anim").fadeOut();
            		  
            	  }
            	  if(data.value == 0){
            		  $(".layui-anim").fadeIn();
            	  }
            	  form.render('radio');
                  form.render('select');
            });  
            

            var url = 'service/shop/add';
            // 回显user数据
            var product = admin.getTempData('t_shop');
            
            if (product) {
            	 if(product.area == 1){
	           		  $(".layui-anim").fadeOut();
	           	  }
            	 form.render('radio');
                 form.render('select');
            	 
                $('input[name="id"]').attr('readonly',
                    'readonly');
                url = 'service/shop/update';
                $("input[name=shopStatus][value=0]").attr("checked", product.shopStatus == 0 ? true : false);
                $("input[name=shopStatus][value=1]").attr("checked", product.shopStatus == 1 ? true : false);
                $("input[name=area][value=0]").attr("checked", product.area == 0 ? true : false);
                $("input[name=area][value=1]").attr("checked", product.area == 1 ? true : false);
                form.val('shop-form', product);
            }

            // 表单提交事件
            form.on('submit(form-submit)', function (data) {
                layer.load(2);
                admin.req(url, data.field, function (data) {
                    layer.closeAll('loading');
                    if (data.code == 1) {
                        layer.msg(data.msg, {
                            icon: 1
                        });
                        admin.finishPopupCenter();
                    } else {
                        layer.msg(data.msg, {
                            icon: 2
                        });
                    }
                }, "post");
                return false;
            });

            form.on('select(provinceCode)', function (data) {
                var parentId = data.elem[data.elem.selectedIndex].title;
                admin.req("area/areaList", {parentId: parentId}, function (obj) {
                    if (obj.code == 1) {
                        var proHtml = '<option value="">请选择</option>;';
                        var data = obj.data;
                        for (var i = 0; i < data.length; i++) {
                            proHtml += '<option value="' + data[i].cityCode + '" title="' + data[i].id + '">' + data[i].cityName + '</option>';
                        }
                        $("select[name=cityCode]").empty().append(proHtml).attr("disabled", false);
                        $("select[name=areaCode]").empty().attr("disabled", true);
                        form.render('select');
                    } else {
                    }
                }, "post");

            })

            form.on('select(cityCode)', function (data) {
                var parentId = data.elem[data.elem.selectedIndex].title;
                admin.req("area/areaList", {parentId: parentId}, function (obj) {
                    if (obj.code == 1) {
                        var proHtml = '<option value="">请选择</option>;';
                        var data = obj.data;
                        for (var i = 0; i < data.length; i++) {
                            proHtml += '<option value="' + data[i].cityCode + '">' + data[i].cityName + '</option>';
                        }
                        $("select[name=areaCode]").empty().append(proHtml).attr("disabled", false);
                        form.render('select');
                    } else {
                    }
                }, "post");

            })
        });
</script>